<!DOCTYPE html>
<html lang="en">
    <head>
        <title>Manager</title>
		<meta charset=utf-8>
       
		<link rel="shortcut icon" href="../favicon.ico" type="image/x-icon"/>
        <link rel="stylesheet" type="text/css" href="css/style.css" />
		<link rel="stylesheet" type="text/css" href="css/jquery.jqplot.min.css" />
    </head>
    <body>
    <?php $host="localhost";
$user="root";
$pwd="";
$nomDB="gl";
$lien=mysql_connect($host,$user,$pwd) or die ("connexion impossible");
mysql_select_db($nomDB, $lien);



?>
		<div id="ac_background" class="ac_background">
			<img class="ac_bgimage" src="images/Default.jpg" alt="Background"/>
			<div class="ac_overlay"></div>
			<div class="ac_loading"></div>
		</div>
		<div id="ac_content" class="ac_content">
			<h1><span style="font-size:32px" id="zone2">Manager </span></h1>
			<div class="ac_menu" id="menu">
				<ul>
					<li>
						<a href="images/Specials.jpg">Satisfaction</a>
						<div class="ac_subitem">
							<span class="ac_close"></span>
							<h2 align="center">Satisfaction</h2>
                             <div id="pie1" style="margin-top:20px; margin-left:20px; width:200px; height:200px;"></div>
                             <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.jqplot.min.js"></script>
<script type="text/javascript" src="js/jqplot.pieRenderer.min.js"></script>
<script class="code" type="text/javascript">$(function(){
    var plot1 = $.jqplot('pie1', [[['a',25],['b',14],['c',7]]], {
        gridPadding: {top:0, bottom:38, left:0, right:0},
        seriesDefaults:{
            renderer:$.jqplot.PieRenderer, 
            trendline:{ show:false }, 
            rendererOptions: { padding: 8, showDataLabels: true }
        },
        legend:{
            show:true, 
            placement: 'outside', 
            rendererOptions: {
                numberRows: 1
            }, 
            location:'s',
            marginTop: '15px'
        }       
    });
});</script>
                             </div>
					</li>
					
					<li>
						<a href="images/MainCourse.jpg">Collaborateurs</a>
						<div class="ac_subitem">
							<span class="ac_close"></span>
							<h2 align="center">Collaborateurs</h2>
							<div id="collaborateur1" align="center">
                            <table id="hor-minimalist-b" summary="Employee Pay Sheet">
    <thead>
    	<tr>
        	<th scope="col">Login</th>
            <th scope="col">Email</th>
			<th scope="col"></th>
        </tr>
    </thead>
    <tbody><?php 

								$requete=" select * from collaborateur";
								$resultat =mysql_query($requete);
								while ($data= mysql_fetch_array($resultat)) { ?>
								<tr><td style:'margin-left:20px;' ><?php echo $data['login']; ?></td><td><?php echo $data['email'];?></td><td> <img src='images/close2.png'  class="de" onClick="deleetecol('<?php echo $data['idcol']?>')"  > </td> </tr><?php }?>
								</tbody></table>
 <form class="form2"><input type="button" id="cCol" value="Nouveau Collaborateur"  align="absbottom " /></form>
 </div>
 <div id="collCreate" align="center" align="justify"><form class="form2" >
Login: <input type="text" id="logincol" name="logincol" size="40" />
Password: <input type="password" id="pwdcol" name="pwdcol" size="40" />
Email: <input type="email" id="emailcol" name="emailcol" /> 
<input type="button" value="Valider"  id="ajoutcoll" onClick="ajoutercol()" /><input type="reset" id="acol" value="Annuler" />
 </form> </div>
						</div>
					</li>
					<li>
						<a href="images/Specials.jpg">Affectation</a>
						<div class="ac_subitem">
							<span class="ac_close"></span>
							<h2 align="center">Affectations</h2>
                            <div align="center">
							 <table align="center" id="hor-minimalist-b" summary="Employee Pay Sheet">
    <thead>
    	<tr>
        	<th scope="col">Emetteur</th>
            <th scope="col">Sujet</th>
            <th scope="col">Message</th>
            <th scope="col">Collaborateur	</th>
			<th scope="col"></th>
            <th scope="col"></th>
        </tr>
    </thead>
    <tbody><?php 								
								$requete1=" select * from reclammation where etat = 0";
								$resultat =mysql_query($requete1);								
								while ($data= mysql_fetch_array($resultat)) {
									$requete=" select * from collaborateur";
									$resultat1 =mysql_query($requete);
									 ?>
								<tr><td style:'margin-left:20px;' ><?php echo $data['logC']; ?></td><td><?php echo $data['objet'];?></td><td><?php echo $data['message'];?></td><td><select><?php while ($data= mysql_fetch_array($resultat1)) {?><option> <?php  echo $data['login'];?></option><?php }?></select></td><td> <img src='images/close2.png'  class="de" onClick="deleeterec('<?php echo $data['id']?>')"  > </td><td> <img src='images/save2.png'  class="de" onClick="saveaffect('<?php echo $data['id']?>')"  > </td> </tr><?php }?>
								</tbody></table>
						</div></div>
					</li>
					<li>
						<a href="images/Desserts.jpg">Validation</a>
						<div class="ac_subitem">
							<span class="ac_close"></span>
							<h2 align="center">Validation</h2>
							<div align="center">
                            <table id="hor-minimalist-b" summary="Employee Pay Sheet">
    <thead>
    	<tr>
        	<th scope="col">Sujet</th>
            <th scope="col">Message </th>
             <th scope="col">Commentaire </th>
			<th scope="col"></th>
        </tr>
    </thead>
    <tbody><?php 

								//$requete=" select * from reclammation";
								$requete=" select * from reclammation where etat = 2";
								$resultat =mysql_query($requete);
								while ($data= mysql_fetch_array($resultat)) { ?>
								<tr><td style:'margin-left:20px;' ><?php echo $data['objet']; ?></td><td><?php echo $data['message'];?><td><?php echo $data['commentaire'];?></td><td> <img src='images/valider.png'  class="de"   > </td> </tr><?php }?>
								</tbody></table>
                            </div>
						</div>
					</li>
					
						
					<li>
						<a href="images/Appetizers.jpg">Clients</a>
						<div class="ac_subitem" id="subclient">
							<span class="ac_close"></span>
							<h2 align="center">Clients</h2>
							<div align="center" id="client1">
							<table id="hor-minimalist-b" summary="Employee Pay Sheet">
    <thead>
    	<tr>
        	<th scope="col">Login</th>
            <th scope="col">Email</th>
			<th scope="col"></th>
        </tr>
    </thead>
    <tbody><?php 

								$requete=" select * from client";
								$resultat =mysql_query($requete);
								while ($data= mysql_fetch_array($resultat)) { ?>
								<tr><td style:'margin-left:20px;' ><?php echo $data['login']; ?></td><td><?php echo $data['email'];?></td><td> <img src='images/close2.png'  class="de" onClick="deleete('<?php echo $data['idcli']?>')"  > </td> </tr><?php }?>
								</tbody></table>
 <form class="form2"><input type="button" id="cCli" value="Nouveau Client"  align="absbottom " /></form>
 </div>
 <div id="clientCreate" align="center" align="justify"><form class="form2" >
Login: <input type="text" id="login" name="login" size="40" />
Password: <input type="password" id="pwd" name="pwd" size="40" />
Email: <input type="email" id="email" name="email" /> 
<input type="button" value="Valider"  id="ajoutclient" onClick="ajouter()" /><input type="reset" id="acli" value="Annuler" />
 </form> </div>
						</div>
					</li>
				</ul>
			</div>
		</div>

		
		<!-- The JavaScript -->

		<script type="text/javascript" src="jqu.js"></script>
		<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
        <script language="javascript" src="script.js" ></script>
		<script type="text/javascript">
			$("#collCreate").hide();
			$("#cCol, #acol").click(function(){
				$("#collaborateur1").toggle();
				$("#collCreate").toggle();
				});
			$("#clientCreate").hide();
			$("#cCli, #acli").click(function(){
				$("#client1").toggle();
				$("#clientCreate").toggle();
			});
			$(".de").click(function(){
				document.location.reload();
			});
			$("#ajoutclient").click(function(){
					document.location.reload();
				});
			
			
				
   
	
			$(function() {
				var $ac_background	= $('#ac_background'),
				$ac_bgimage		= $ac_background.find('.ac_bgimage'),
				$ac_loading		= $ac_background.find('.ac_loading'),
				
				$ac_content		= $('#ac_content'),
				$title			= $ac_content.find('h1'),
				$menu			= $ac_content.find('.ac_menu'),
				$mainNav		= $menu.find('ul:first'),
				$menuItems		= $mainNav.children('li'),
				totalItems		= $menuItems.length,
				$ItemImages		= new Array();
				
				/* 
				for this menu, we will preload all the images. 
				let's add all the image sources to an array,
				including the bg image
				*/
				$menuItems.each(function(i) {
					$ItemImages.push($(this).children('a:first').attr('href'));
				});
				$ItemImages.push($ac_bgimage.attr('src'));
					  
				
				var Menu 			= (function(){
					var init				= function() {
						loadPage();
						initWindowEvent();
					},
					loadPage			= function() {
						/*
							1- loads the bg image and all the item images;
							2- shows the bg image;
							3- shows / slides out the menu;
							4- shows the menu items;
							5- initializes the menu items events
						 */
						$ac_loading.show();//show loading status image
						$.when(loadImages()).done(function(){
							$.when(showBGImage()).done(function(){
								//hide the loading status image
								$ac_loading.hide();
								$.when(slideOutMenu()).done(function(){
										$.when(toggleMenuItems('up')).done(function(){
										initEventsSubMenu();
									});
								});
							});
						});
					},
					
					showBGImage			= function() {
						return $.Deferred(
						function(dfd) {
							//adjusts the dimensions of the image to fit the screen
							adjustImageSize($ac_bgimage);
							$ac_bgimage.fadeIn(1000, dfd.resolve);
						}
					).promise();
					},
					slideOutMenu		= function() {
						/* calculate new width for the menu */
						var new_w	= $(window).width() - $title.outerWidth(true);
						return $.Deferred(
						function(dfd) {
							//slides out the menu
							$menu.stop()
							.animate({
								width	: new_w + 'px'
							}, 700, dfd.resolve);
						}
					).promise();
					},
						/* shows / hides the menu items */
						toggleMenuItems		= function(dir) {
						return $.Deferred(
						function(dfd) {
							/*
							slides in / out the items. 
							different animation time for each one.
							*/
							$menuItems.each(function(i) {
										var $el_title	= $(this).children('a:first'),
											marginTop, opacity, easing;
										if(dir === 'up'){
											marginTop	= '0px';
											opacity		= 1;
											easing		= 'easeOutBack';
										}
										else if(dir === 'down'){
											marginTop	= '60px';
											opacity		= 0;
											easing		= 'easeInBack';
						}
								$el_title.stop()
								.animate({
													marginTop	: marginTop,
													opacity		: opacity
												 }, 200 + i * 200 , easing, function(){
									if(i === totalItems - 1)
										dfd.resolve();
								});
							});
						}
					).promise();
					},
					initEventsSubMenu	= function() {
						$menuItems.each(function(i) {
							var $item		= $(this), // the <li>
							$el_title	= $item.children('a:first'),
							el_image	= $el_title.attr('href'),
							$sub_menu	= $item.find('.ac_subitem'),
							$ac_close	= $sub_menu.find('.ac_close');
							
							/* user clicks one item : appetizers | main course | desserts | wines | specials */
							$el_title.bind('click.Menu', function(e) {
									$.when(toggleMenuItems('down')).done(function(){
									openSubMenu($item, $sub_menu, el_image);
								});
								return false;
							});
							/* closes the submenu */
							$ac_close.bind('click.Menu', function(e) {
								closeSubMenu($sub_menu);
								return false;
							});
						});
					},
					openSubMenu			= function($item, $sub_menu, el_image) {
						$sub_menu.stop()
						.animate({
							height		: '400px',
							marginTop	: '-200px'
						}, 400, function() {
										//the bg image changes
							showItemImage(el_image);
						});
					},
						/* changes the background image */
					
					closeSubMenu		= function($sub_menu) {
						$sub_menu.stop()
						.animate({
							height		: '0px',
							marginTop	: '0px'
						}, 400, function() {
							//show items
										toggleMenuItems('up');
						});
					},
						/*
						on window resize, ajust the bg image dimentions,
						and recalculate the menus width
						*/
					initWindowEvent		= function() {
						/* on window resize set the width for the menu */
						$(window).bind('resize.Menu' , function(e) {
							adjustImageSize($ac_bgimage);
							/* calculate new width for the menu */
							var new_w	= $(window).width() - $title.outerWidth(true);
							$menu.css('width', new_w + 'px');
						});
					},
						/* makes an image "fullscreen" and centered */
					adjustImageSize		= function($img) {
						var w_w	= $(window).width(),
						w_h	= $(window).height(),
						r_w	= w_h / w_w,
						i_w	= $img.width(),
						i_h	= $img.height(),
						r_i	= i_h / i_w,
						new_w,new_h,
						new_left,new_top;
							
						if(r_w > r_i){
							new_h	= w_h;
							new_w	= w_h / r_i;
						}
						else{
							new_h	= w_w * r_i;
							new_w	= w_w;
						}
							
						$img.css({
							width	: new_w + 'px',
							height	: new_h + 'px',
							left	: (w_w - new_w) / 2 + 'px',
							top		: (w_h - new_h) / 2 + 'px'
						});
					},
						/* preloads a set of images */
					loadImages			= function() {
						return $.Deferred(
						function(dfd) {
							var total_images 	= $ItemImages.length,
							loaded			= 0;
							for(var i = 0; i < total_images; ++i){
								$('<img/>').load(function() {
									++loaded;
									if(loaded === total_images)
										dfd.resolve();
								}).attr('src' , $ItemImages[i]);
							}
						}
					).promise();
					};
						
					return {
						init : init
					};
				})();
			
				/*
			call the init method of Menu
				 */
				Menu.init();
		
			});
		</script>
       

    </body>
</html>